.container {
  background-color: #fff;
  font-family: PingFang SC, PingFang SC;

  .calendar {
    width: 100%;
    display: grid;
    padding-left: 26rpx;
    box-sizing: border-box;
    font-size: 24rpx;
    grid-template-columns: repeat(auto-fill, 14.2%);
  }

  //如果原高度改了 此处要跟着改
  .header-vertical-center {
    line-height: 84rpx;
  }
  .calendars-item {
    width: 86rpx;
    height: 84rpx;
    display: inline-block;
    position: relative;
    text-align: center;
    background-color: #fff;
  }

  .calendars-item-active {
    width: 86rpx;
    height: 84rpx;
    position: relative;
    text-align: center;
    color: $primary-text-color;
    border-radius: 8rpx;
    display: inline-block;
    background-color: $primary-color;
  }

  .calendars-item-content {
    width: 100%;
    height: calc(100% - 4rpx);
    display: flex;
    flex-direction: column;
  }
  
  .flex-end {
    justify-content: flex-end;
  }

  .flex-center {
    justify-content: center;
  }

  .price {
    font-size: 16rpx;
    color: #878787;
  }

  .price-active {
    font-size: 16rpx;
    color: #fff;
  }


  .calendars-month {
    width: 100%;
    height: 116rpx;
    padding: 0 24rpx;
    font-weight: 500;
    box-sizing: border-box;

    .current-month {
      font-size: 32rpx;
    }

    .switch-month {
      height: 40rpx;
      font-size: 30rpx;
      line-height: 40rpx;
    }
  }

  .bg-white {
    background-color: #fff;
  }

  .color-999 {
    color: #999;
  }

  .f-size {
    font-size: 16rpx;
  }
}